<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>系统管理-课程活动</title>
    <link href="../c/base.css" rel="stylesheet" type="text/css">
    <link href="../c/toefl.css" rel="stylesheet" type="text/css">
    <link href="../c/bootstrap.min.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="../j/jquery-2.1.0.js"></script>
    <script type="text/javascript" src="../j/bootstrap.min.js"></script>
    <script type="text/javascript" src="../j/lrtk.js"></script>
    <link href="../j/ligerUI/skins/Aqua/css/ligerui-dialog.css" rel="stylesheet" type="text/css"/>
    <script src="../j/ligerUI/js/core/base.js" type="text/javascript"></script>
    <script src="../j/ligerUI/js/plugins/ligerDialog.js" type="text/javascript"></script>
    <script src="../j/ligerUI/js/plugins/ligerDrag.js" type="text/javascript"></script>
    <script src="../j/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>

    <script type="text/javascript" th:inline="none">
        $(function(){
            var boxs = $("input[type='checkbox'][id^='box_']");


            $("tr[id^='data_']").hover(function(){
                $(this).css("backgroundColor","#eeccff");
            },function(){
                $(this).css("backgroundColor","#ffffff");
            });

            $("#checkAll").click(function() {
                boxs.prop("checked", this.checked);
            });

            $("#").click(function(){
                /** 获取到用户选中的复选框  */
                var checkedBoxs = boxs.filter(":checked");
                if(checkedBoxs.length < 1){
                    $.ligerDialog.error("请选择一门需要的公开课！");
                }else{
                    var ids = checkedBoxs.map(function(){
                        return this.value;
                    })

                    $.ligerDialog.confirm("确认要删除吗?","删除文章",function(r){
                        if(r){
                            window.location = "deleteClassInfos?classId=" + ids.get();
                        }
                    });
                }
            });

            $("#update").click(function(){
                $("#addForm").attr("action","updateSysActive");

                /** 获取到用户选中的复选框  */
                var checkedBoxs = boxs.filter(":checked");
                if(checkedBoxs.length < 1){
                    $.ligerDialog.error("请选择一门要编辑的活动");
                }else{
                    var ids = checkedBoxs.map(function(){
                        return this.value;
                    });

                    $.ligerDialog.confirm("确认要编辑吗?","编辑活动",function(r){
                        if(r){
                            // window.location = "updateSysActive?ActiveId=" + ids.get();
                            var id = ids.get();
                            $("#fuzhi").prop("value",id);
                        }
                    });
                }
            });

            $("#delete").click(function(){
                /** 获取到用户选中的复选框  */
                var checkedBoxs = boxs.filter(":checked");
                if(checkedBoxs.length < 1){
                    $.ligerDialog.error("请选择一个需要删除的活动！");
                }else{
                    var ids = checkedBoxs.map(function(){
                        return this.value;
                    });

                    $.ligerDialog.confirm("确认要删除吗?","删除活动",function(r){
                        if(r){

                            window.location ="deleteSysActive?activeIds=" + ids.get();

                        }
                    });
                }
            })


            $("#save").click(function () {
                $("#addForm").submit();
            });

            $("#add").click(function () {
                $("#addForm").prop("action","addSysActive");
            });


        });





    </script>

</head>
<body>


<div class="doc1180 paddingT20 fn-clear">
    <div style="font-size: 20px; color: red;margin-bottom: 30px;">
        温馨提示：活动的宣传页需要裁剪为850*330像素的图片，效果最佳，为保证轮播效果，当前活动不建议超过7个。

    </div>
    <div class="myPost_Theme" style="height: 70vh;">
        <table width="100%" border="0" cellspacing="0" cellpadding="0" class="myPost_Table">
            <tr class="myPost_Th">
                <th><input type="checkbox" id="checkAll"  /></th>
                <th>活动名称</th>
                <th>课程名称</th>
                <th>课程讲师</th>
                <th>发布日期</th>
                <th>开始时间</th>
                <th class="last">报名人数</th>
            </tr>
            <tr th:each="sa,i:${sysActives}">
                <td><input type="checkbox" th:id="'box_'+${i.index}" th:value="${sa.getActiveId()}"/></td>
                <td class="myPost_ThemeTitle"><img th:src="${sa.getImgUrl()}" style="width: 100px;height: 100px; ">[[${sa.activeName}]]</td>
                <td th:text="${sa.getClassInfor().getClassTitle()}">【托福写作】-1</td>
                <td th:text="${sa.getTeacher().getUser_name()}">
                    alax
                </td>
                <td >[[${#dates.format(sa.getClassInfor().getStartDate(),'yyyy-MM-dd')}]]</td>
                <td>[[${#dates.format(sa.getClassInfor().getStartDate(),'yyyy-MM-dd')}]]</td>
                <td th:text="${sa.getClassInfor().getSignupNum()}">20000</td>
            </tr>

        </table>

        <!--操作区-->
        <div  class="container" style="margin-top: 40px;">
            <a id="add" class="btn btn-success" data-toggle="modal" data-target=".modal">创建</a>
            <a id="update" class="btn btn-warning"  data-toggle="modal" data-target=".modal">编辑</a>
            <a id="delete" class="btn btn-danger" >删除</a>
        </div>
    </div>


</div>

<!--表单元素-->
<div class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">活动信息</h4>
            </div>
            <div class="modal-body">

                <!--提交区-->
                <form action="addSysActive" id="addForm" method="post" enctype="multipart/form-data">
                    <!--隐藏域  用于修改提交activeIds-->
                    <input type="hidden" name="activeId" value="" id="fuzhi" />
                    <div class="form-group">
                        <label>活动名称</label>
                        <input type="text" name="activeName" class="form-control" placeholder="活动名称">
                    </div>
                    <div class="form-group">
                        <label>公开课</label>
                        <select name="classId" class="form-control">
                            <option th:each="c:${ClassInforAdmin}"  th:value="${c.getClassId()}">[[${c.classTitle }]]</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label>宣传图片</label>
                        <input type="file" name="upImage" id="exampleInputFile">
                        <p class="help-block">宣传图片应当裁剪为850*330像素</p>
                    </div>
                    <div class="form-group">
                        <label>活动描述</label>
                        <textarea name="activeDesc" class="form-control" rows="10" cols="" placeholder="此处的文字不能超过100字"></textarea>
                    </div>
                </form>


            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" id="save" class="btn btn-primary">保存</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script type="text/javascript">

</script>


<!-- 代码结束 -->
</body>
</html>
